<template>
  <div class="data-main tabStyle">
    <el-table
      ref="multipleTable"
      v-adaptive
      class="data_table"
      :data="assignmentsData"
      height="100px"
      fit
    >
      <el-table-column
        v-if="deviceAttributes.length > 0"
        prop="eventDate"
        label="时间"
        width="180"
        fixed
      >
        <template slot-scope="scope">
          {{ scope.row.eventDate | formatDate("", true) }}
        </template>
      </el-table-column>
      <el-table-column
        v-for="(attribute, index) in deviceAttributes"
        :key="index"
        width="180"
        :prop="attribute.token"
        :label="attribute.name"
      >
        <template slot-scope="scope">
          {{ scope.row.metadata[attribute.token] }}
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { formatTime } from "@/views/common/js/utils.js";
import { getDeviceTypeAttributes } from "@/api/deviceType";
import { getMeasurements } from "@/api/assignments";
export default {
  props: {
    pageNum: {
      type: Number
    },
    pageSize: {
      type: Number
    },
    height: {
      type: String
    },
    deviceTypeToken: {
      type: String
    },
    deviceActiveAssignmentsToken: {
      type: String
    }
  },
  data() {
    return {
      attributeSelectTokens: [],
      deviceAttributes: [],
      assignmentsData: []
    };
  },
  mounted() {},
  created() {},
  methods: {
    formatDateT(date) {
      return formatTime(date);
    },
    init() {
      this.getDeviceAttributes();
    },
    handleParamsFilter() {
      this.pageNum = 1;
      this.getDeviceAttributes();
    },
    // 获取点位列表
    getDeviceAttributes() {
      var params = {
        page: 1,
        pageSize: 0,
        attributeTokenList: this.attributeSelectTokens
      };
      getDeviceTypeAttributes(params, this.deviceTypeToken).then(res => {
        this.deviceAttributes = res.data.results;
        if (res.data.numResults > 0) {
          this.getDeviceRunTimeData();
        }
      });
    },
    // 获取历史数据
    getDeviceRunTimeData() {
      var params = {
        page: this.pageNum,
        pageSize: this.pageSize
      };
      getMeasurements(params, this.deviceActiveAssignmentsToken).then(res => {
        this.assignmentsData = res.data.results;
        this.$emit("setPageToatl", res.data.numResults);
        this.$nextTick(() => {
          this.$refs.multipleTable.doLayout();
        });
      });
    }
  }
};
</script>

<style lang="scss" scoped>
// .el-table th>.cell {
//     margin-left: 22px;
// }

// .el-table .cell {
//     margin-left: 22px;
// }
</style>
